<template>
  <div id="chart2">

  </div>
</template>

<script>
import * as echarts from 'echarts';
export default {
  name: "echarts-one",
  data() {
    return {
      myEcharts:'',
      options : {
        title: {
          text: '累计客户投诉次数'
        },
        radar: {
            center: ['50%', '60%'], // 中心点设置
          // shape: 'circle',
          indicator: [
            {name: '机电', max: 6500},
            {name: '转轮', max: 16000},
            {name: '控制器', max: 30000},
            {name: '盛水器', max: 38000},
            {name: '风扇', max: 52000},
            {name: '压缩机', max: 25000},
            {name: '热交换器', max: 25000},
          ]
        },
        series: [
          {
            name: '累计客户投诉次数',
            type: 'radar',
            data: [
              {
                value: [4200, 3000, 20000, 35000, 50000, 18000],
                name: '累计客户投诉次数'
              },
            ],
            lineStyle: {
              //边缘颜色
              width: 1,
              color: '#32d1b5',
            },
            areaStyle: {
              color: '#56d7c1',
              opacity: 0.2,
            },
            itemStyle: {
              show:false,
              color: '#32d1b5',
            },


          }
        ]
      }
    }
  },
  methods:{
    initChart() {
      const chartDom = document.getElementById('chart2');
      this.myEcharts = echarts.init(chartDom);
      this.options && this.myEcharts .setOption(this.options);
    },
  },
}
</script>

<style lang="scss" scoped>
@import "src/styles/conversion.scss";
*{font-size: px2vh(16)}
#chart2{
  width: 100%;
  height: 100%;
}
</style>
